const CracoLessPlugin = require('craco-less');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { BundleAnalyzerPlugin } = require("webpack-bundle-analyzer");
const ManifestPlugin = require('webpack-manifest-plugin');

const paths = require('./config/paths');
const path = require('path');
const { DH_NOT_SUITABLE_GENERATOR } = require('constants');
const env = process.env.NODE_ENV
// 配置入口
const entry = {}
paths.appIndexJs.forEach(e => {
  entry[e.name] = [
    require.resolve('react-dev-utils/webpackHotDevClient'),
    e.path
  ].filter(Boolean)
});
console.log(entry, 1)
let htmlPlugin =  Object.keys(paths.entries).map((name) => {
  return new HtmlWebpackPlugin(
    Object.assign(
      {},
      {
        inject: true,
        chunks: [name],
        template: paths.appHtml,
        filename: name + '.html',
      },
      {
        minify: {
          removeComments: true,
          collapseWhitespace: true,
          removeRedundantAttributes: true,
          useShortDoctype: true,
          removeEmptyAttributes: true,
          removeStyleLinkTypeAttributes: true,
          keepClosingSlash: true,
          minifyJS: true,
          minifyCSS: true,
          minifyURLs: true,
        },
      }
    )
  )
})
let output = {
  path: paths.appBuild,
  publicPath: '/',
  filename: 'static/js/[name]/[name].[contenthash:8].js',
  chunkFilename: 'static/js/[name]/[name].[contenthash:8].chunk.js',
  // devtoolModuleFilenameTemplate: info =>{
  //   console.log(info, 11)
  //   return path.resolve(info.absoluteResourcePath).replace(/\\/g, '/')
  // }  

}
console.log(output, 2)
module.exports = {
  webpack: {
    plugins: [
      // 打包的时候生成分析表
      // new BundleAnalyzerPlugin(),
      // 生成多个html文件
      ...htmlPlugin,
      // 修改entry的属性，因为默认是对象
      new ManifestPlugin({
        fileName: 'asset-manifest.json',
        publicPath: paths.publicUrlOrPath,
        generate: (seed, files, entrypoints) => {
          const manifestFiles = files.reduce((manifest, file) => {
              manifest[file.name] = file.path;
              return manifest;
          }, seed);
          const entrypointFiles = []
          for (let entrypoint of Object.keys(entrypoints)) {
            entrypointFiles.push(
              entrypoints[entrypoint].filter(
                fileName => !fileName.endsWith('.map')
              )
            )
          }
          console.log(entrypointFiles, 551)
          return {
            files: manifestFiles,
            entrypoints: entrypointFiles
          };
        }
      }),
    ],
    optimization: {
      splitChunks: {
        cacheGroups: {
          commons: {
            chunks: 'initial',
            minChunks: 2, maxInitialRequests: 5,
            minSize: 0
          },
          vendor: {
            test: /node_modules/,
            chunks: 'initial',
            name: 'vendor',
            priority: 10,
            enforce: true

          }
        }
      },
      UglifyJsPlugin: {
          // 删除注释
          output:{
            comments:false
          },
          // 删除console debugger 删除警告
          compress: {
            warnings: false,
            drop_debugger: true,
            drop_console: true,//不打印log
          },
      }
    },
    configure: (webpackConfig, { env, paths }) => {
      console.log(webpackConfig.entry, 3)
      // console.log(webpackConfig.output, 4)
      console.log(webpackConfig.entry, 51)
      // // console.log(webpackConfig.plugins, 53)
      // // console.log(Object.assign({},webpackConfig.entry,entry), 52)
      webpackConfig.entry = entry
      // webpackConfig.entry = [
      //   '/Users/yangminghui/study/jiagou/react-mulit/node_modules/react-dev-utils/webpackHotDevClient.js',
      //   '/Users/yangminghui/study/jiagou/react-mulit/src/index.js',
      //   '/Users/yangminghui/study/jiagou/react-mulit/src/page1/index.tsx',
      // ]
      
      
      // webpackConfig.output = Object.assign(webpackConfig.output, output)
      console.log(webpackConfig.entry, 7)
      console.log(webpackConfig.output, 8)
      return webpackConfig; 
    }
  },
  plugins: [
    {
      plugin: CracoLessPlugin,
      options: {
        lessLoaderOptions: {
          lessOptions: {
            modifyVars: { '@primary-color': '#1DA57A' },
            javascriptEnabled: true,
          },
        },
      },
    },
  ],
  devServer: {
    proxy: {
        "/api": {
            target: "http://baidu.com",  
            //target: 'http://192.168.9.19:8080',
            changeOrigin: true,
            pathRewrite: {
                "^/api": ""
            }
        }
    }
  },
  babel:{  
    plugins: [
      ["@babel/plugin-proposal-decorators", { legacy: true }],  //装饰器
      [   
        "import", 
        {
          "libraryName": "antd",
          "libraryDirectory": "es",
           "style": true //设置为true即是less
         }
     ]
    ]
  }
}